<script setup>
	import { ref } from 'vue';
	import { getNoticeDetailAPI } from '../../api/api';
	import {onLoad} from '@dcloudio/uni-app'
	const noticeId = ref()
	const noticeData = ref({})
	onLoad((e) => {
		console.log(e);
		noticeId.value = e.id
		if (e.name) {
			uni.setNavigationBarTitle({
				title: e.name
			})
		}
		
		getNoticeDetail()
	})
	async function getNoticeDetail() {
		const res = await getNoticeDetailAPI({id: noticeId.value})
		console.log(res);
		noticeData.value = res.data
	}
	
	
</script>


<template>
	<view class="noticeLayout">
		<view class="title">
			<view class="tag" v-if="noticeData.select">
				<uni-tag text="置顶" type="error" inverted></uni-tag>
			</view>
			<view class="font">如有疑问请添加本人微信反馈问题</view>
		</view>
		
		<view class="info">
			<view class="item">流逝的岁月</view>
			<view class="item">
				<uni-dateformat :date="noticeData.publish_date" format="yyyy-MM-dd hh:mm:ss"></uni-dateformat>
			</view>
		</view>
		
		<view class="content">
			<!-- <rich-text :nodes="noticeData.content"></rich-text> -->
			<!-- <mp-html :content="noticeData.content" /> -->
			<image style="width: 100%;" mode="aspectFit" src="/static/images/vx.jpg" alt="" />
		</view>
		
		<view class="count">
			阅读 {{noticeData.view_count}}
		</view>
	</view>
</template>


<style scoped lang='scss'>
	.noticeLayout{
		padding:30rpx;
			.title{
				font-size: 40rpx;
				color:#111;
				line-height: 1.6em;
				padding-bottom:30rpx;
				display: flex;
				.tag{
					transform: scale(0.8);
					transform-origin: left center;
					flex-shrink: 0;	
				}
				.font{
					padding-left:6rpx;
				}
			}
			.info{
				display: flex;
				align-items: center;
				color:#999;
				font-size: 28rpx;
				.item{
					padding-right: 20rpx;
				}
			}
			.content{
				padding:60rpx 0;
			}
			.count{
				color:#999;
				font-size: 28rpx;
			}
	}
</style>
